<template>
    <div class="recommend">
      <div v-for="(item,index) in recommends" :key="index" class="recommend-item">
        <a :href="item.link"></a>
        <img :src="item.image" alt="">
        <div>{{ item.title }}</div>
      </div>
    </div>
</template>

<script>
    export default {
        name: "RecommendView",
      props:{
          recommends:{
            type:Array,
            default(){
              return [];
            }
          }
      }
    }
</script>

<style scoped>
.recommend{display: flex;width: 100%;text-align: center;
  border-bottom:8px solid #eee;font-size: 12px;padding: 10px 0 20px}

  .recommend-item{flex: 1}
.recommend-item img{
  margin-bottom: 10px;
  width: 80px;
  height: 80px;
}
</style>
